<template>
    <div class="wrapper home_wrap">
        <div class="header">
            <div class="header_welcome">
                <div class="header-icon">
                    <img :src="user_info.headimgurl"  v-if="user_info.headimgurl">
                    <img src="../../assets/images/home/avator.png" alt="头像" v-else>
                </div>
                <div class="header_tip">
                    <div style="font-size: 20px;margin-bottom: 10px">{{user_info.name}} {{user_info.role_name ? '(' + user_info.role_name + ')' : ''}}</div>
                    <div style="margin-top: 5px">{{user_info.phone}}</div>
                </div>
            </div>
        </div>
        <div class="menu mb20">
            <div>
                <ul class="menu_list clue_menu_list">
                    <template v-for="(child, index) in menu_list">
                        <li  @click="jump_url(child.url)" ref="menuli"
                             :key="index"
                             :style="{height: menuliH}"
                             v-if="user_info.rid<10">
                            <img :src="child.img" alt="" :style="{width: IconW}"/>
                            <span>{{child.name}}</span>
                        </li>
                    </template>

                </ul>
            </div>
        </div>
    </div>
</template>

<script>
    import api_user from "../../api/api_user";
    import _wx from "../../common/_wx";
    import _router from "../../common/_router";


    export default {
        name: 'index',
        data() {
            return {
                //昵称
                menuliH: '',
                IconW: '',
                // user_nick: _user.get().nick,
                code: '', //登录code
                user_info: {},
                menu_list: [
                    {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/user', name: '员工管理'},
                    // {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/business', name: '权限设置'},
                    {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/apply', name: '活动申请'},
                    {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/activity', name: '活动管理'},
                    // {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/order',name: '订单列表'},
                    {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/result', name: '项目业绩'},
                    // {img: require('../../assets/images/home/autoshow_clue.png'), url: '/manage/manage', name: '活动管理'},
                ]
            }
        },
        created() {
            // 获取openid
            _wx.openid(this.wx_login)
            this.$nextTick(()=>{
                this.menuliH = this.$refs.menuli[0].offsetWidth + 'px';
                this.IconW = this.$refs.menuli[0].offsetWidth*0.4 + 'px';
            })

        },

        methods: {
            wx_login() {
                let that = this
                api_user.login(function (data) {
                    console.log(data, '====')
                    that.user_info = data.user
                })
            },

            jump_url(url) {
                _router.jmp_url(url)
            },
        }
    }
</script>
<style scoped lang="less">
    @import "../../assets/style/manage/index";
</style>
